<!--
  ~ Electronic Logistics Management Information System (eLMIS) is a supply chain management system for health commodities in a developing country setting.
  ~
  ~ Copyright (C) 2015  John Snow, Inc (JSI). This program was produced for the U.S. Agency for International Development (USAID). It was prepared under the USAID | DELIVER PROJECT, Task Order 4.
  ~
  ~ This program is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version.
  ~
  ~ This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU Affero General Public License for more details.
  ~
  ~ You should have received a copy of the GNU Affero General Public License along with this program.  If not, see <http://www.gnu.org/licenses/>.
  -->

<div ng-controller="IVDLogisticsColumnTemplate">
  <h4>
   <span openlmis-message="label.vaccine.logistics.title"></span>
  </h4>
  <hr />
  <div ng-show="sortableColumns">
    <form name="configureRnRTemplateForm" ng-submit="onSave()">
      <div class="rnr-template-head">
        <span class="tpl-visible" openlmis-message="template.header.display"></span>
        <span class="tpl-indicator">&nbsp;</span>
        <span class="tpl-label" openlmis-message="template.header.label"></span>
        <span class="tpl-source" openlmis-message="template.header.source"></span>
      </div>
    <div class="rnr-template-columns">

      <ul ui-sortable="sortableColumns" ng-model="sortableColumns" id="sortable">
        <li id="{{rnrColumn.name}}" ng-repeat="rnrColumn in sortableColumns" style="position: relative;">
          <div class="drag-handle"></div>
            <span class="tpl-visible">
              <input type="checkbox" ng-model="rnrColumn.visible" ng-disabled="rnrColumn.mandatory"/>
            </span>
            <span class="tpl-indicator">
              <div class="indicator" openlmis-message="rnrColumn.indicator"></div>
            </span>
            <span class="tpl-label">
              <span class="col-desc" openlmis-message="rnrColumn.description"></span>
            </span>
        </li>
      </ul>
    </div>

    <div form-toolbar id="action_buttons" class="action-buttons">
      <div class="form-cell button-row">
        <input type="submit" class="btn btn-primary save-button" openlmis-message="button.save"/>
        <a ng-href="/" class="btn btn-cancel cancel-button" openlmis-message="button.cancel"></a>
      </div>
      <div class="toolbar-error" id="saveErrorMsgDiv" openlmis-message="error" ng-show="error"></div>
      <div class="toolbar-success" id="saveSuccessMsgDiv" openlmis-message="message" ng-show="message"></div>
    </div>
    </form>
    </div>
</div>